<#include "../common/header.htm">
<body class="gray-bg top-navigation">
<div class="content-wrapper">
	<section class="content">
		<div class="row">
			<div class="col-sm-12">
				<div class="tabs-container">
					<ul class="nav nav-tabs navzi">
						<li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true">一键导入</a>
						</li>
						<!--<li class=""><a data-toggle="tab" href="#tab-2" aria-expanded="false">自定义导入</a>
						</li>-->
						<!--<div class="importming">导入说明<span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span></div>-->
					</ul>
					<button type="button" class="btn btn-default imbtn" title="导入说明"
							data-container="body" data-toggle="popover" data-placement="left"
							data-content="<li>1,一键导入主要针对在模板库存中存在的话单</li><li>2,自定义导入主要针对格式化比较复杂的话单，导入完成后需手动配置话单标题</li>">
						导入说明
					</button>

					<div class="importti">
						<span class="sming"></span>
						<span class="importfont">温馨提示：每次选择导入的文件不要超过10个，主要支持的文件格式有：.xls，.xlsx，.csv，.pdf，.txt，如果您的文件是其他类型，请联系我们的技术人员协助处理，电话：0371-88917000</span>
					</div>
					<div class="tab-content">
						<div id="tab-1" class="tab-pane active">
							<div class="panel-body">
								<div class="box">
									<form action="#" method="get" id="listForm" >
										<div class="form-group">
											<input id="file-1" accept=".pdf,.csv, .xlsx, .xls,.txt" type="file" name="fileUpload" multiple="multiple" class="file" data-overwrite-initial="false" />
											<input type="hidden" id="nextNumber" name="nextNumber" value="${nextNumber!}"/>
											<input type="hidden" id="callbackResult" name="callbackResult"/>
										</div>
									</form>
								</div>
								<!--上传按钮 bengin-->
								<div class="importAndClear">
									<button onclick="beginImport()"  type="button" class="btn btn-primary up">
										开始导入
									</button>
									<!--<a href="#" style="display: none;" onclick="clearFile()">清空</a>-->
								</div>
							</div>
							<button onclick="showCaseObjectMapping()" type="button" id="caseObjectPhone" style="display: none;" class="gldx el-button el-button--primary">
								关联案件对象<span class="gldxwen" data-container="body" data-toggle="popover" data-placement="top"
											data-content="<li>1,一键导入主要针对在模板库存中存在的账单</li><li>2,自定义导入主要针对格式化比较复杂的账单，导入完成后需手动配置账单标题</li>">></span>
							</button>
							<!-- end -->
							<!--导入结果-->
							<div class="result">
								<el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
									<el-tab-pane label="导入结果" name="first">
										<div class="importrt" id="importrtTitle"></div>
										<table id="dg"></table>
									</el-tab-pane>
									<el-tab-pane label="已导入数据" name="second">
										<el-select v-model="excelVal" placeholder="请选择" @change="changeHandle">
											<el-option
													v-for="item in logDataArr"
													:key="item.DEAL_FLOW_UUID"
													:label="item.FILE_NAME"
													:value="item.DEAL_FLOW_UUID">
											</el-option>
										</el-select>
										<div class="detail">
											<table id="dg2"></table>
										</div>
									</el-tab-pane>
								</el-tabs>
							</div>
						</div>
						<div id="tab-2" class="tab-pane">
							<div class="panel-body">
								<form action="#" method="get" >
									<div class="form-group">
										<input id="file-2" accept=".pdf,.csv, .xlsx, .xls,.txt" type="file" name="fileUpload" multiple="multiple" class="file" data-overwrite-initial="false" />
									</div>
								</form>
								<div class="importAndClear">
									<button onclick="beginImport()" type="button" class="btn btn-primary up">
										开始导入
									</button>
									<!--<a href="#" style="display: none;" onclick="clearFile()">清空</a>-->
								</div>
							</div>
							<!-- end -->
							<div class="zdyresult">
								<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
									<el-tab-pane label="导入结果" name="first">
										<table id="zdydg" title="自定义导入"></table>
									</el-tab-pane>
									<el-tab-pane label="导入数据" name="second">
										<el-select v-model="excelVal" placeholder="请选择" @change="changeHandle">
											<el-option
													v-for="item in logDataArr"
													:key="item.DEAL_FLOW_UUID"
													:label="item.FILE_NAME"
													:value="item.DEAL_FLOW_UUID">
											</el-option>
										</el-select>
										<div class="detail">
											<table id="zdydg2"></table>
										</div>
									</el-tab-pane>
								</el-tabs>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
</div>
</body>
<script type="text/javascript">
    $(function(){
        $("[data-toggle='popover']").popover({html : true });

        $(".billreferbtn").click(function(){
            $(this).find(".glyphicon").toggleClass("glyphicon-menu-down");
            $(this).find(".glyphicon").toggleClass("glyphicon-menu-up")
        })
        $(".billreferbtn").mouseout(function(){
            // $(this).find(".glyphicon").removeClass("glyphicon-menu-up");
        })
    })
    var caseId=parent.caseId;
    /*导入成功文件id*/
   	var fileUUids = new Array();
    /*初始化fileinput插件*/
    var obj=$("#file-1").fileinput({
        language: 'zh',//汉化
        uploadUrl : '${ctx}/phone/record/uploadPhoneFile?caseId='+caseId,//上传地址
        allowedFileExtensions : ['txt' ,'csv', 'xls' , 'xlsx','pdf'],//支持格式
        showClose : false,//屏蔽x号关闭案件
        uploadAsync:false,//采用同步上传
        showUploadedThumbs : false,//是否在预览窗口中持续显示上传的文件缩略图
        overwriteInitial : false,//将其设置为false将有助于始终从数据库中显示已保存的图像或文件
        browseOnZoneClick : true,//浏览区域点击
        autoReplace : true,//是否自动替换当前文件，设置为true时，再次选择文件， 会将当前的文件替换掉。
        maxFileSize : 0,
        maxFilesNum : 0,
        maxFileCount:10,
        showBrowse:true,
        showUpload: true,//Boolean 是否显示上传按钮 true,
        showRemove : true,//关闭删除按钮
        removeFromPreviewOnError : true,
        layoutTemplates :{
            actionUpload : '',
            actionZoom : ''   //去除上传预览缩略图中的查看详情预览的缩略图标。
        },
        previewSettings: {
            image: {width: "100px", height: "100px"},
        },
        initialPreviewAsData: true,
        allowedPreviewTypes :null, //设置为空，null或false以禁用所有类型的预览
        showPreview :true, //是否显示预览
        preferIconicPreview: true, // 开启用图标替换预览效果
        previewFileIconSettings: {
            'docx': '<i class="fa fa-file-word-o text-primary"></i>',
            'xlsx': '<i class="fa fa-file-excel-o text-success"></i>',
            'pptx': '<i class="fa fa-file-powerpoint-o text-danger"></i>',
            'doc': '<i class="fa fa-file-word-o text-primary"></i>',
            'xls': '<i class="fa fa-file-excel-o text-success"></i>',
            'ppt': '<i class="fa fa-file-powerpoint-o text-danger"></i>',
            'pdf': '<i class="fa fa-file-pdf-o text-danger"></i>',
            'txt': '<i class="fa fa-file-text-o text-info"></i>',
        },
        slugCallback : function(filename) {
            return filename.replace('(', '_').replace(']', '_');
        }
    }).on('filepreupload', function(event, data, previewId, index) {     //上传中
        var form = data.form, files = data.files,filenames = data.filename, extra = data.extra,
            response = data.response, reader = data.reader;
    }).on("filebatchuploadsuccess", function(event, data) {    //文件上传成功
    	fileUUids = new Array();
        $('.result').show();
        $('#caseObjectPhone').show();
        $(".importAndClear button").html("开始导入")
        $(".importAndClear button").attr('disabled',false);
        $(".importAndClear a").show();
        var ids=data.response.data.ids;
        $('#importrtTitle').html("本次共选择"+data.response.data.totalFile+"个文件，导入成功"+data.response.data.successFile+"个，失败"+data.response.data.errorFile+"个");
        if (ids){
            dg(ids);
        }
        $(".fileinput-remove-button").click();
        window.parent.refreshTree();
    }).on('fileerror', function(event, data, msg) {
    }).on("filesuccessremove", function(event, data) {
    }).on("fileuploaded", function(event, data, previewId, index) {
    }).on("filecleared",function (event, data, msg) { //文件被全部删除
        console.log("文件被全部删除")
    }).on("fileclear",function (event, data, msg) { //某个文件被删除
        console.log("某个文件被删除")
    }).on("upload",function (event, data, msg) {
    }).on("filebatchselected",function (event, files) {//文件被上传
        if (files.length>0){
			for (let i = 0; i < files.length; i++) {
				let filename=files[i].name;
				changFilePng(filename,i)
			}
            $(".importAndClear a").show()
        }else{
            $(".importAndClear a").hide()
        }
    });


    /*初始化fileinput插件*/
    var obj2=$("#file-2").fileinput({
        language: 'zh',//汉化
        uploadUrl : '${ctx}/bill/billImportMapping',//上传地址
        allowedFileExtensions : ['txt' ,'csv', 'xls' , 'xlsx','pdf'],//支持格式
        showClose : false,//屏蔽x号关闭案件
        uploadAsync:false,//采用同步上传
        showUploadedThumbs : false,//是否在预览窗口中持续显示上传的文件缩略图
        overwriteInitial : false,//将其设置为false将有助于始终从数据库中显示已保存的图像或文件
        browseOnZoneClick : true,//浏览区域点击
        autoReplace : true,//是否自动替换当前文件，设置为true时，再次选择文件， 会将当前的文件替换掉。
        maxFileSize : 0,
        maxFilesNum : 0,
        maxFileCount:10,
        showBrowse:true,
        showUpload: true,//Boolean 是否显示上传按钮 true,
        showRemove : true,//关闭删除按钮
        removeFromPreviewOnError : true,
        layoutTemplates :{
            actionUpload : '',
            actionZoom : ''   //去除上传预览缩略图中的查看详情预览的缩略图标。
        },
        previewSettings: {
            image: {width: "100px", height: "100px"},
        },
        initialPreviewAsData: true,
        allowedPreviewTypes :null, //设置为空，null或false以禁用所有类型的预览
        showPreview :true, //是否显示预览
        preferIconicPreview: true, // 开启用图标替换预览效果
        previewFileIconSettings: {
            'docx': '<i class="fa fa-file-word-o text-primary"></i>',
            'xlsx': '<i class="fa fa-file-excel-o text-success"></i>',
            'pptx': '<i class="fa fa-file-powerpoint-o text-danger"></i>',
            'doc': '<i class="fa fa-file-word-o text-primary"></i>',
            'xls': '<i class="fa fa-file-excel-o text-success"></i>',
            'ppt': '<i class="fa fa-file-powerpoint-o text-danger"></i>',
            'pdf': '<i class="fa fa-file-pdf-o text-danger"></i>',
            'txt': '<i class="fa fa-file-text-o text-info"></i>',
        },
        slugCallback : function(filename) {
            return filename.replace('(', '_').replace(']', '_');
        }
    }).on('filepreupload', function(event, data, previewId, index) {     //上传中
        var form = data.form, files = data.files,filenames = data.filename, extra = data.extra,
            response = data.response, reader = data.reader;

    }).on("filebatchuploadsuccess", function(event, data) {    //文件上传成功
        var rows = [];
        $('.zdyresult').show()
        rows.push(data.response.data);
        zdydg(data.response.data);
        window.parent.refreshTree();
    }).on("fileuploaded", function(event, data, previewId, index) {
    }).on("filecleared",function (event, data, msg) { //文件被全部删除
        console.log("文件被全部删除")
    }).on("fileclear",function (event, data, msg) { //某个文件被删除
        console.log("某个文件被删除")
    }).on("upload",function (event, data, msg) {
    }).on("filebatchselected",function (event, files) {//文件被上传
        if (files.length>0){
            $(".importAndClear a").show()
        }else{
            $(".importAndClear a").hide()
        }
    });

    $(function () {
        $(".input-group.file-caption-main.no-browse").hide();
        $(".input-group.file-caption-main").hide();
    })
    function beginImport() {
        $('.result').hide();
        $(".fileinput-upload-button").click();
        $(".importAndClear button").html("正在导入...")
        $(".importAndClear button").attr('disabled',true);
        $(".importAndClear a").hide();
        $('#caseObjectPhone').hide();
        importLog.excelVal='';
        importLog.logDataArr=[];
        importLog.activeName='first';
    }
    function clearFile() {
        $('.result').hide();
        $(".fileinput-remove-button").click();
        $('#caseObjectPhone').hide();
    }
    function dg(ids){
        $('#dg').datagrid({
            url: '${ctx}/datalog/importDataList_easyui',
            method: 'post',
            iconCls: 'icon-save',
            queryParams:{//每次请求的参数
                ids: ids,
                caseId:caseId
            },
            pageList:[10,20,40,50,100],//每页记录数选择范围设置
            pageNumber:1,//当前页号,
            pageSize:20,//每页显示记录数
            loadMsg:"正在加载，请稍后",//加载数据时的提示信息
            emptyMsg:"暂无信息",//加载数据为空时的信息
            //height: 710,
            width:1300,
            rownumbers:true,//序号
            fitColumns: true,//使表格自适应页面宽度
            pagination: true,//是否分页
            singleSelect: true,
            columns:[[ //每一列的具体设置。
                {field:'FILE_NAME',title:'文件名',width:'20%'},
                {field:'FILE_SIZE',title:'文件大小',width:'20%',
                    formatter: function(value,row,index){ //当前值，当前的row，当前的索引
                    	if (value < 1024) {
				            return value + 'B';
				      	} else if (value < (1024*1024)) {
				            var temp = value / 1024;
				            temp = temp.toFixed(2);
				            return temp + 'KB';
				      	} else if (value < (1024*1024*1024)) {
				        	var temp = value / (1024*1024);
				            temp = temp.toFixed(2);
				         	return temp + 'MB';
				    	} else {
				         	var temp = value / (1024*1024*1024);
				         	temp = temp.toFixed(2);
				         	return temp + 'GB';
				      	}
						return value;
                    }
                },
                {field:'IMPORT_RESULT',title:'导入结果',width:'20%',
                    formatter: function(value,row,index){ //当前值，当前的row，当前的索引
                        value+="(成功导入"+row.SUCCESS_NUMBER+"条)"
                        return value
                    }
                },
                {field:'IMPORT_DESC',title:'失败原因',width:'20%'},
                {field:'IMPORTDETAILID',title:'操作',align:'center',
                    formatter: function(value,row,index){ //当前值，当前的row，当前的索引
                        // let uuid=row.DEAL_FLOW_UUID;
                        // let id=row.IMPORTDETAILID;
                        return "<a href='#' onclick='delLog(\""+row.DEAL_FLOW_UUID+"\",2,\""+row.IMPORTDETAILID+"\")'>删 除</a>"
                    }
                }
            ]],
            onLoadSuccess: function(data){
                if (!data.rows.length){
                    $('.result').hide();
                }else{
                    importLog.logDataArr=data.rows;
                    //文件导入成功，将文件DEAL_FLOW_UUID保存fileUUids
                    $.each(data.rows ,function (i,n) {
                    	fileUUids.push(n.DEAL_FLOW_UUID);
            		});
                }
            }
        });
    }
    function dg2(excelLog){
        var casemanageId = parent.caseId;
        if (!casemanageId) {
            toastr.error("案件id为空");
            return;
        }
        if (!excelLog) {
            excelLog="xxx";//给一个假值，让表头初始化
        }
        $('#dg2').datagrid({
            url: '${ctx}/phone/record/phoneRecordDetail',
            method: 'post',
            iconCls: 'icon-save',
            queryParams:{//每次请求的参数
                uuid: excelLog,
                casemanageId:casemanageId
            },
            pageList:[10,20,40,50,100],//每页记录数选择范围设置
            pageNumber:1,//当前页号,
            pageSize:20,//每页显示记录数
            loadMsg:"正在加载，请稍后",//加载数据时的提示信息
            emptyMsg:"暂无信息",//加载数据为空时的信息
            //height: 710,
            rownumbers:true,//序号
            fitColumns: true,//使表格自适应页面宽度
            pagination: true,//是否分页
            singleSelect: true,
            columns:[[ //每一列的具体设置。
                {field:'SERVICE_NUMBER',title:'服务号码'},
                {field:'SERVICE_USER_INFORMATION',title:'服务号码用户信息'},
                {field:'SERVICE_LOCATION',title:'服务号码归属地'},
                {field:'BUSINESS_TYPE',title:'业务类型'},
                {field:'PARTY_NUMBER',title:'对方号码'},
                {field:'PARTY_USER_INFORMATION',title:'对方号码用户信息'},
                {field:'PARTY_LOCATION',title:'对方号码归属地'},
                {field:'CALL_TYPE',title:'呼叫类型',
                    formatter: function(value,row,index){ //当前值，当前的row，当前的索引
                        switch (value) {//0:主叫  1：被叫  2：短信发送 3：短信接收
                            case 0:return '主叫'
                            case 1:return '被叫'
                            case 2:return '短信发送'
                            case 3:return '短信接收'
                        }
                    }
                },
                {field:'STARTING_TIME',title:'起始时间',sortable : true,
                    formatter: function(value,row,index){ //当前值，当前的row，当前的索引
                        if(value){
                            var date = new Date(value);
                            return formatDate(date, 'yyyy-MM-dd hh:mm:ss');
                        }else{
                            return '-';
                        }
                    }
                },
                {field:'TALK_TIME',title:'通话时长'},
                {field:'LAC',title:'地区区域码'},
                {field:'CID',title:'基站代码'},
            ]],
            onLoadSuccess: function(data){
            }
        });
    }
    function delLog(dealFlowUuid,tableFlat,importDetailId){
        var d1 = top.dialog({
            title: '提示',
            content: '您确定要删除么！',
            okValue: '确 定',
            ok: function() {
                $.ajax({
                    url: "${ctx}/datalog/deleteFlow",
                    type: "post",
                    data: {
                        dealFlowUuid: dealFlowUuid,
                        tableFlat:tableFlat,
                        importDetailId:importDetailId,
                        caseManagerId:caseId,
                    },
                    success: function (msg) {
                        toastr.success("删除成功");
                        $('#dg').datagrid('reload');
                        window.parent.refreshTree();
                    }
                })
                return;
            },
            cancelValue: '取消',
            cancel: function() {}
        });
        d1.showModal();

    };
    function zdydg(data){
        $('#zdydg').datagrid({
            rownumbers : true,
            singleSelect : true,
            autoRowHeight : false,
            pagination : true,
            pageSize : "20",
            loadMsg : "正在加载，请稍后",//加载数据时的提示信息
            emptyMsg :"暂无信息",//加载数据为空时的信息
            //每次表格加载数据都会调用此拦截器
            loadFilter : pagerFilter,
            columns : [[ //每一列的具体设置。
                {field:'accountBody',title:'交易主体',align:'center'},
                {field:'accountBodyNumber',title:'交易主体账号',align:'center'},
                {field:'accountBodyCard',title:'交易主体卡号',align:'center'},
                {field:'accountBodyBank',title:'主体归属行',align:'center'},
                {field:'accountRival',title:'交易对手',align:'center'},
                {field:'accountRivalNumber',title:'交易对手账号',align:'center'},
                {field:'accountRivalCard',title:'交易对手账号',align:'center'},
                {field:'accountMoney',title:'交易金额',align:'center'},
                {field:'contentAbstract',title:'摘要',align:'center'},
                {field:'currency',title:'币种',align:'center'}
            ]],
            onLoadSuccess: function(data){
                console.log(data)
                if (!data.rows.length){
                    $('.zdyresult').hide()
                }else{
                    importLog.logDataArr=data.rows
                }
            }
        }).datagrid('loadData', data);
    };
    function pagerFilter(data){
        if (typeof data.length == 'number' && typeof data.splice == 'function'){	// is array
            data = {
                total: data.length,
                rows: data
            }
        }
        var dg = $(this);
        var opts = dg.datagrid('options');
        var pager = dg.datagrid('getPager');
        pager.pagination({
            onSelectPage:function(pageNum, pageSize){
                opts.pageNumber = pageNum;
                opts.pageSize = pageSize;
                pager.pagination('refresh',{
                    pageNumber:pageNum,
                    pageSize:pageSize
                });
                dg.datagrid('loadData',data);
            }
        });
        if (!data.originalRows){
            data.originalRows = (data.rows);
        }
        var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
        var end = start + parseInt(opts.pageSize);
        data.rows = (data.originalRows.slice(start, end));
        return data;
    };
    function showCaseObjectMapping(){
		var data = {"fileUUids": fileUUids,"casemanageId": caseId}
        var d = top.dialog({
            title : "关联案件对象",
            modal : true,
            url : '${ctx}/casemanage/showCaseObjectPhoneMapping',
            height : 880,
            width : 1500,
            data : data
        });
        d.show();
        return false;
	};
    let importLog=new Vue({
        el: ".result",
        visible: false,
        data: {
            logDataArr: [],
            excelVal: '',
            activeName:'first',
        },
        methods: {
            handleClick(){
                if (this.activeName=='second'&&this.logDataArr.length>0) {
                    this.excelVal=this.logDataArr[0].DEAL_FLOW_UUID
                }else{
                    this.excelVal=''   //初始化uuid
                }
                this.changeHandle()
            },
            changeHandle(){
                dg2(this.excelVal);
            }
        }
    })
</script>
<style>
	span.gldxwen {
		background:url("${ctx}/imgs/gldxwen.png") no-repeat;
		display: inline-block;
		width: 14px;
		height: 14px;
		vertical-align: middle;
		margin-left: 5px;
	}
	.gldx {
		width: 130px!important;
		height: 30px;
		line-height: 6px;
		margin-right: -3px;
		position: absolute;
		top: 413px;
		right: 40px;
		z-index: 2;
	}
	.importrt {
		margin-top: 10px;
		margin-bottom: -10px;
	}
	.el-popover, .el-tabs--border-card{
		box-shadow: none;
	}
	.panel.datagrid.panel-htop{
		width: 100%!important;
	}
	.datagrid-view2{
		width: 100%!important;
		padding-left: 30px;
	}

	button.btn.btn-default.imbtn {
		position: absolute;
		right: 25px;
		z-index: 1;
		background-color: transparent;
		border-color: transparent;
		color: #287CDF;
		top: 9px;
	}
	span.sming {
		position: absolute;
		top: 8px;
		left: 8px;
	}
	span.importfont {
		margin-left: 30px;
	}
	.el-popover__title {
		font-size: 14px;
		font-weight: 600;
	}
	.el-popover{
		line-height: 20px;
	}
	.importck {
		color: #287CDF;
		cursor: pointer;
	}
	.importck:hover {
		color: #3296f1;
	}
	button.el-button.el-button--default {
		border: transparent;
		position: absolute;
		right: 55px;
		top: 9px;
		color: #287CDF;
		background: transparent;
	}
	button.el-button.el-button--default:hover{
		background-color: transparent;
	}
	span.glyphicon.glyphicon-menu-down {
		padding-left: 7px;
	}
	span.glyphicon.glyphicon-menu-up {
		padding-left: 7px;
		font-size: 10px;
	}
	.importming {
		height: 50px;
		position: absolute;
		right: 45px;
		top: 16px;
		color: #1890ff;
		font-size: 14px;
		cursor: pointer;
	}
	.importti{
		margin-left: 25px;
		height: 30px;
		margin-top: 10px;
	}
	.panel-body {
		border-color: transparent!important;
	}
	ul.nav.nav-tabs.navzi {
		height: 36px;
		margin-left: 10px;
	}
	ul.nav.nav-tabs.navzi li{
		height: 36px;
	}
	ul.nav.nav-tabs.navzi li a{
		height: 34px;
		line-height: 6px;
	}
	.tabs-container .nav-tabs.navzi > li.active > a{
		border-color: transparent!important;
		color: #000;
	}
	.top-navigation .nav > li a:focus, .top-navigation .nav > li a:hover{
		color: #000;
	}
	.file-preview{
		border-color: transparent;
		padding: 0;
		height: 100%;
	}
	.file-drop-zone.clickable {
		min-height: 220px;
	}
	.file-drop-zone{
		margin: 0;
	}
	.tabs-container .panel-body{
		padding: 0;
		margin-left: 0;
		padding-top: 0;
	}
	#myModalLabel {
		color:black;
		text-align: left;
	}
	div#addform {
		overflow: hidden;
	}
	.modal-body {
		padding: 10px!important;
	}
	.el-select-dropdown__item.selected{
		background: #FFFFFF;
	}
	.el-select-dropdown__item.selected.hover{
		background: #f5f7f5 !important;
	}
	.el-select-dropdown__item.selected{
		color: #409EFF;
	}
	.importAndClear{
		width: 200px;
		margin: 0 auto;
		height: 40px
	}
	.importAndClear a{
		line-height: 40px;
		padding-left: 10px;
	}
	.result{
		margin-top: 35px;
		display: none;
		padding-left: 20px;
		padding-right: 10px;
	}
	.zdyresult{
		margin-top: 40px;
		display: none;
	}
	.detail{
		margin-top: 20px;
	}
	.el-tabs--border-card>.el-tabs__header .el-tabs__item{
		margin: 0;
	}
	.el-tabs--border-card{
		border-top: transparent;
	}
	.el-tabs__item.is-active {
		border-top: 1px solid #E4E7ED !important;
	}
	.el-tabs__item.is-active {
		color: #000!important;
	}
	.el-tabs__item.is-active {
		height: 40px;
	}
	.el-tabs__nav {
		height: 40px;
	}
	.el-tabs__nav-scroll {
		height: 40px;
	}
	.el-tabs__nav-wrap {
		height: 40px;
	}
	.el-tabs__header {
		height: 40px;
	}
	.el-tabs--border-card > .el-tabs__header{
		background-color: #fff;
	}
	.el-tabs--border-card > .el-tabs__content{
		padding: 0;
	}
	.panel.datagrid.panel-htop {
		border: 1px solid #D3D3D3;
		margin-top: 20px;
	}
	.el-tabs--border-card>.el-tabs__header .el-tabs__item:not(.is-disabled):hover {
		color: #000;
	}
	.el-tabs--border-card{
		border: transparent!important;
	}
	input.el-input__inner {
		margin-top: 20px;
		width: 260px;
		height: 30px;
		border: solid 1px #d9d9d9;
	}
	.el-input__icon{
		top: 35px!important;
	}
	.el-select-dropdown__wrap{
		margin-bottom:-16px!important;
	}
</style>
</html>

